<template>
    <div style="padding:20px 10px;">
        <el-row style="margin-bottom:10px;">
            <el-col :span="24">
            <el-button type="primary" @click="addRole"><Icon type="md-add" />新增风控管理</el-button>
            </el-col>
        </el-row>
        <admincentertb ref="httbRef" width="250" 
        :btn-is-show="btnIsShow" 
        :table-col="tabUserList" 
        :table-data="tableUserData"
        @deleteSelectData="deleteSelectData"
        />
        <div style="text-align:right;margin-top:10px;">
            <el-pagination
            :current-page="page"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="size"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            />
        </div>

        <el-dialog :close-on-click-modal="false" :title="title" width="30%" :visible.sync="dialogTableVisible">
        <!-- 名称和路径必输 -->
        <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="80px" class="demo-ruleForm autoClass">
            <el-form-item label="风控类型" prop="riskType">
            <el-input :disabled="disFlag" v-model="ruleForm['riskType']" clearable placeholder="" />
          </el-form-item>
          <el-form-item label="	查询sql" prop="querySql">
            <el-input :disabled="disFlag" v-model="ruleForm['querySql']" clearable placeholder="" />
          </el-form-item>
          <el-form-item label="	消息" prop="msg">
            <el-input :disabled="disFlag" v-model="ruleForm['msg']" clearable placeholder="" />
          </el-form-item>
        </el-form>
        <div style="text-align: center;">
          <el-button type="primary" @click="commitFromData('ruleForm')">确定</el-button>
          <el-button @click="resetForm('return')">返回</el-button>
        </div>
      </el-dialog>
    </div>
</template>

<script>
import request from '@/utils/request';
    export default{
        data(){
            return {
                title:"新增",
                ruleForm:{
                    querySql:"",
                    msg:"",
                    riskType:""
                },
                rules:{},
                dialogTableVisible:false,
                tabUserList:[
                    {
                        key: 'riskType',
                        title: '风控类型'
                    },
                    {
                        key: 'querySql',
                        title: '查询sql'
                    },
                    {
                        key: 'msg',
                        title: '消息'
                    },
                ],
                total: 0,
                size: 10,
                page: 1,
                tableUserData:[],
                btnIsShow:{
                    operate: true,
                    detile: false,
                    del: true
                }
            }
        },
        mounted(){
            this.$nextTick(res=>{
                this.getUserList()
            })
        },
        methods:{
            editRowData(v){
                this.title = '修改'
                this.ruleForm = JSON.parse(v)
                this.dialogTableVisible = true
            },
            deleteSelectData(v){
                request({
                    url: '/ht-bpmn/risk/removeRiskById?id='+v.id,
                    method: 'get',
                    data:{}
                }).then((res) => {
                    if(res.code==200){
                        this.getUserList()
                        this.$message.success('删除成功')
                    }else{
                        this.$message.success(res.msg)
                    }
                })
            },
            commitFromData(){
                this.title == '新增'? delete this.ruleForm.id:""
                request({
                    url: '/ht-bpmn/risk/addOrUpdateRisk',
                    method: 'post',
                    data:this.ruleForm
                }).then((res) => {
                    if(res.code==200){
                        this.getUserList()
                        this.resetForm()
                        this.$message.success(this.title+'成功')
                    }else{
                        this.$message.success(res.msg)
                    }
                })
            },
            resetForm(){
                this.dialogTableVisible = false
                this.ruleForm = {
                    querySql:"",
                    msg:"",
                    riskType:""
                }
            },
            addRole(){
                this.title = '新增'
                this.ruleForm['roleName'] = ""
                this.dialogTableVisible = true
            },
            handleSizeChange(v) {
                this.page = 1
                this.size = v
                this.getUserList()
            },
            handleCurrentChange(v) {
                this.page = v
                this.getUserList()
            },
        
            // 获取用户列表
            getUserList() {
                this.$refs.httbRef.isShowLoading(true)
                request({
                    url: '/ht-bpmn/risk/findRiskList',
                    method: 'post',
                    data:{
                        "limit":this.size,
                        "page":this.page
                    }
                }).then((res) => {
                    this.$refs.httbRef.isShowLoading(false)    
                    if(res.code==200){
                        this.tableUserData = res.data.records
                        this.total = res.data.total
                    }
                })
            }
        }
    }

</script>